<div class="user-main-title">
    <h2 class="title">
        栏目标题 <span class="sub">这里放栏目描述</span>
    </h2>
    <a class="more" href="javascript:;">操作链接 &gt;</a>
    <a class="tit-action" href="javascript:;">操作按钮</a>
</div>
<div class="user-action-main">
    <form class="pure-form mu-form">
        <fieldset>
            <div class="search-group">
                <input type="text" name="consignee" placeholder="请输入商品标题或订单编号进行检索">
                <button type="submit" class="pure-button pure-button-primary">检索</button>
                <a href="javascript:;" class="more-link">更多检索条件</a>
            </div>
            <div class="pure-control-group">
            <label class="group-tit" class="group-tit">订单日期</label>
            <input type="text" name="consignee" placeholder="时间范围起始">
            <input type="text" name="consignee" placeholder="时间范围结束">
            <label class="group-tit" class="group-tit">订单类型</label>
            <select name="select" class="select-block">
                <option value="">订单类型</option>
            </select>

            <label class="group-tit" class="group-tit">交易状态</label>
            <select name="select" class="select-block">
                <option value="">交易状态</option>
            </select>
            <button type="submit" class="pure-button pure-button-primary">检索</button>
            <button type="button" class="pure-button pure-button-default">重置</button>
        </div>
        </fieldset>
    </form>
    <div class="mu-cut-line"></div>
    <form class="pure-form pure-form-aligned mu-form mu-form-aligned">
        <fieldset>
            <div class="pure-control-group">
                <label class="group-tit" class="group-tit" for="consignee">收货人</label>
                <input id="consignee" type="text" name="consignee" placeholder="请输入收货人姓名">
            </div>
            <div class="pure-control-group">
                <label class="group-tit" for="tel_phone">联系电话</label>
                <input id="tel_phone" type="text" name="tel_phone" placeholder="请输入收货人联系电话">
            </div>
            <div class="pure-control-group">
                <label class="group-tit">所在区域</label>
                <select id="prov_id" name="prov_id" class="form-avg-3">
                    <option value="">山西省</option>
                </select>
                <select id="city_id" name="city_id" class="form-avg-3">
                    <option value="">晋中市</option>
                </select>
                <select id="dist_id" name="dist_id" class="form-avg-3">
                    <option value="">榆次区</option>
                </select>
            </div>
            <div class="pure-control-group">
                <label class="group-tit" for="address">详细地址</label>
                <input id="address" type="text" placeholder="请输入详细地址">
            </div>
            <div class="pure-control-group">
                <label class="group-tit" for="address">复选框</label>
                <label for="check1" class="pure-checkbox form-avg-4">
                    <input id="check1" type="checkbox"> 复选内容1复选内容1复选内容1复选内容1复选内容1复选内容1复选内容1复选内容1
                </label>
                <label for="check2" class="pure-checkbox form-avg-4">
                    <input id="check2" type="checkbox"> 复选内容2
                </label>
            </div>
            <div class="pure-control-group">
                <label class="group-tit" for="address">单选内容</label>
                <label class="pure-radio">
                    <input type="radio" name="sex" value="option1" checked>
                    男
                </label>
                <label  class="pure-radio">
                    <input type="radio" name="sex" value="option2">
                    女
                </label>
                <label  class="pure-radio">
                    <input type="radio" name="sex" value="option2">
                    保密
                </label>
            </div>
            <div class="pure-control-group">
                <label class="group-tit" for="content">备注信息</label>
                <textarea id="content" placeholder="请输入备注信息"></textarea>
            </div>
            <div class="pure-control-group">
                <label class="group-tit" for="select">单个select</label>
                <select id="select" name="select" class="select-block">
                    <option value="">选项内容</option>
                </select>
            </div>
            <div class="pure-controls">
                <label class="group-tit" for="cb" class="pure-checkbox">
                    <input id="cb" type="checkbox"> 设为默认地址
                </label>
            </div>
            <div class="um-action-box">
                <button type="submit" class="pure-button pure-button-primary">确认保存</button>
            </div>
        </fieldset>
    </form>
    <div class="mu-cut-line"></div>
    <div class="block-title">
        收货地址列表
    </div>
    <ul class="mu-address-list">
        <li class="item item-tit">
            <table>
                <tr>
                    <td class="consignee">收货人</td>
                    <td class="address">收货地址</td>
                    <td class="tel">联系电话</td>
                    <td class="action">操作</td>
                </tr>
            </table>
        </li>
        <li class="item active">
            <table>
                <tr>
                    <td class="consignee">柴赟</td>
                    <td class="address">山西省 晋中市 榆次区顺城西街399号名仕嘉园小区1292测试地址长度及显示问题测试地址长度及显示问题测试地址长度及显示问题</td>
                    <td class="tel">130****5151</td>
                    <td class="action">
                        <a href="javascript:;" class="action-link">编辑</a>
                        <a href="javascript:;" class="action-link">删除</a>
                    </td>
                </tr>
            </table>
        </li>
        <li class="item">
            <table>
                <tr>
                    <td class="consignee">柴赟</td>
                    <td class="address">山西省 晋中市 榆次区顺城西街399号名仕嘉园小区1292测试地址长度及显示问题测试地址长度及显示问题测试地址长度及显示问题</td>
                    <td class="tel">130****5151</td>
                    <td class="action">
                        <a href="javascript:;" class="action-link">编辑</a>
                        <a href="javascript:;" class="action-link">删除</a>
                        <a href="javascript:;" class="action-link">设为默认</a>
                    </td>
                </tr>
            </table>
        </li>
        <li class="item">
            <table>
                <tr>
                    <td class="consignee">柴赟</td>
                    <td class="address">山西省 晋中市 榆次区顺城西街399号名仕嘉园小区1292测试地址长度及显示问题测试地址长度及显示问题测试地址长度及显示问题</td>
                    <td class="tel">130****5151</td>
                    <td class="action">
                        <a href="javascript:;" class="action-link">编辑</a>
                        <a href="javascript:;" class="action-link">删除</a>
                        <a href="javascript:;" class="action-link">设为默认</a>
                    </td>
                </tr>
            </table>
        </li>
    </ul>

    <div class="block-title">
        优惠券
    </div>
    <div class="mc-avg-3 avg-margin-10">
        <div class="item">
            <div class="mu-stamp mu-stamp01">
                <div class="par">
                    <p class="shop-name">这里是店铺名称显示</p>
                    <div class="coupon">
                        <span class="sign">￥</span><span class="money">50.00</span><span class="sub">优惠券</span>
                    </div>
                    <div class="desc">这里显示的是使用条件。订单满多少可使用</div>
                </div>
                <div class="copy">
                    <span class="validity">有效期：2015-08-13~2016-08-13</span>
                    <a href="#" class="use-link">立即使用</a>
                </div>
                <i class="mask"></i>
            </div>
        </div>
        <div class="item">
            <div class="mu-stamp mu-stamp02">
                <div class="par">
                    <p class="shop-name">这里是店铺名称显示</p>
                    <div class="coupon">
                        <span class="sign">￥</span><span class="money">50.00</span><span class="sub">优惠券</span>
                    </div>
                    <div class="desc">这里显示的是使用条件。订单满多少可使用</div>
                </div>
                <div class="copy">
                    <span class="validity">有效期：2015-08-13~2016-08-13</span>
                    <a href="#" class="use-link">立即使用</a>
                </div>
                <i class="mask"></i>
            </div>
        </div>
        <div class="item">
            <div class="mu-stamp mu-stamp03">
                <div class="par">
                    <p class="shop-name">这里是店铺名称显示</p>
                    <div class="coupon">
                        <span class="sign">￥</span><span class="money">50.00</span><span class="sub">优惠券名称</span>
                    </div>
                    <div class="desc">这里显示的是使用条件。订单满多少可使用</div>
                </div>
                <div class="copy">
                    <span class="validity">有效期：2015-08-13~2016-08-13</span>
                    <a href="#" class="use-link">立即使用</a>
                </div>
                <i class="mask"></i>
                <i class="status status2"></i>
            </div>
        </div>
        <div class="item">
            <div class="mu-stamp mu-stamp04">
                <div class="par">
                    <p class="shop-name">这里是店铺名称显示</p>
                    <div class="coupon">
                        <span class="sign">￥</span><span class="money">50.00</span><span class="sub">优惠券</span>
                    </div>
                    <div class="desc">这里显示的是使用条件。订单满多少可使用</div>
                </div>
                <div class="copy">
                    <span class="validity">有效期：2015-08-13~2016-08-13</span>
                    <a href="#" class="use-link">立即使用</a>
                </div>
                <i class="mask"></i>
                <i class="status status1"></i>
            </div>
        </div>
    </div>
    <div class="block-title">
        收藏商品列表
    </div>
    <div class="mc-avg-5 avg-margin-10">
        <div class="item">
            <div class="goods-item-shop">
                <div class="thumb">
                    <img src="//img.alicdn.com/bao/uploaded/i3/TB1pYmUPXXXXXXRaFXXXXXXXXXX_!!0-item_pic.jpg_160x160xz.jpg" alt="">
                    <a href="javascript:;" class="del-action"></a>
                    <div class="action">
                        <a href="javascript:;" class="link">进入店铺</a>
                        <a href="javascript:;" class="link">查看商品</a>
                    </div>
                </div>
                <div class="text-info">
                    <div class="goods-name">
                        <a href="" class="goods-link">Meizu/魅族 魅蓝3S全网通公开版4G指纹识别智能手机3s</a>
                    </div>
                    <div class="shop-name">
                        <a href="" class="shop-link">Meizu/魅族自营旗舰店</a>
                    </div>
                    <div class="price">
                        <span class="goods-price">
                            ￥3200.99
                        </span>
                        <span class="market-price">
                            4300.00
                        </span>
                    </div>
                </div>
            </div>
        </div>
        <div class="item">
            <div class="goods-item-shop">
                <div class="thumb">
                    <img src="//img.alicdn.com/bao/uploaded/i3/TB1pYmUPXXXXXXRaFXXXXXXXXXX_!!0-item_pic.jpg_160x160xz.jpg" alt="">
                    <a href="javascript:;" class="del-action"></a>
                    <div class="action">
                        <a href="javascript:;" class="link">进入店铺</a>
                        <a href="javascript:;" class="link">查看商品</a>
                    </div>
                </div>
                <div class="text-info">
                    <div class="goods-name">
                        <a href="" class="goods-link">Meizu/魅族 魅蓝3S全网通公开版4G指纹识别智能手机3s</a>
                    </div>
                    <div class="shop-name">
                        <a href="" class="shop-link">Meizu/魅族自营旗舰店</a>
                    </div>
                    <div class="price">
                        <span class="goods-price">
                            ￥3200.99
                        </span>
                        <span class="market-price">
                            4300.00
                        </span>
                    </div>
                </div>
            </div>
        </div>
        <div class="item">
            <div class="goods-item-shop">
                <div class="thumb">
                    <img src="//img.alicdn.com/bao/uploaded/i3/TB1pYmUPXXXXXXRaFXXXXXXXXXX_!!0-item_pic.jpg_160x160xz.jpg" alt="">
                    <a href="javascript:;" class="del-action"></a>
                    <div class="action">
                        <a href="javascript:;" class="link">进入店铺</a>
                        <a href="javascript:;" class="link">查看商品</a>
                    </div>
                </div>
                <div class="text-info">
                    <div class="goods-name">
                        <a href="" class="goods-link">Meizu/魅族 魅蓝3S全网通公开版4G指纹识别智能手机3s</a>
                    </div>
                    <div class="shop-name">
                        <a href="" class="shop-link">Meizu/魅族自营旗舰店</a>
                    </div>
                    <div class="price">
                        <span class="goods-price">
                            ￥3200.99
                        </span>
                        <span class="market-price">
                            4300.00
                        </span>
                    </div>
                </div>
            </div>
        </div>
        <div class="item">
            <div class="goods-item-shop">
                <div class="thumb">
                    <img src="//img.alicdn.com/bao/uploaded/i3/TB1pYmUPXXXXXXRaFXXXXXXXXXX_!!0-item_pic.jpg_160x160xz.jpg" alt="">
                    <a href="javascript:;" class="del-action"></a>
                    <div class="action">
                        <a href="javascript:;" class="link">进入店铺</a>
                        <a href="javascript:;" class="link">查看商品</a>
                    </div>
                </div>
                <div class="text-info">
                    <div class="goods-name">
                        <a href="" class="goods-link">Meizu/魅族 魅蓝3S全网通公开版4G指纹识别智能手机3s</a>
                    </div>
                    <div class="shop-name">
                        <a href="" class="shop-link">Meizu/魅族自营旗舰店</a>
                    </div>
                    <div class="price">
                        <span class="invalid">
                            商品已经失效了
                        </span>
                    </div>
                </div>
            </div>
        </div>
        <div class="item">
            <div class="goods-item-shop">
                <div class="thumb">
                    <img src="//img.alicdn.com/bao/uploaded/i3/TB1pYmUPXXXXXXRaFXXXXXXXXXX_!!0-item_pic.jpg_160x160xz.jpg" alt="">
                    <a href="javascript:;" class="del-action"></a>
                    <div class="action">
                        <a href="javascript:;" class="link">进入店铺</a>
                        <a href="javascript:;" class="link">查看商品</a>
                    </div>
                </div>
                <div class="text-info">
                    <div class="goods-name">
                        <a href="" class="goods-link">Meizu/魅族 魅蓝3S全网通公开版4G指纹识别智能手机3s</a>
                    </div>
                    <div class="shop-name">
                        <a href="" class="shop-link">Meizu/魅族自营旗舰店</a>
                    </div>
                    <div class="price">
                        <span class="goods-price">
                            ￥3200.99
                        </span>
                        <span class="market-price">
                            4300.00
                        </span>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="block-title">
        收藏的店铺列表
    </div>
    <div class="mu-shop-collection">
        <div class="item">
        <div class="shop-info-box">
            <div class="shop-logo">
                <a href="javascript:;">
                    <img src="https://img30.360buyimg.com/popshop/jfs/t826/160/1351541112/7356/a70b9a6e/559f692aN188be41c.png" alt="">
                </a>
            </div>
            <div class="shop-name">
                <a href="javascript:;">锤子科技官方旗舰店</a>
            </div>
            <div class="shop-level">
                <span class="tag">自营</span>
                <span class="tag vip">VIP6</span>
            </div>
            <div class="follow-num">
                关注量：12323
            </div>
            <div class="action">
                <a href="javascript:;" class="link">进入店铺</a>
                <a href="javascript:;" class="link">取消关注</a>
            </div>
        </div>
        <div class="goods-box">
            <div class="mc-picScroll-left">
                <a class="next"><i class="iconfont icon-zuoyou1"></i></a>
                <a class="prev"> <i class="iconfont icon-zuoyou"></i></a>
                <div class="bd">
                    <ul class="picList">
                        <li>
                            <div class="mc-goods-item-sm">
                                <a href="javascript:;" class="link"></a>
                                <div class="img-thumb">
                                    <img src="../static/images/cp019.jpg" alt="">
                                </div>
                                <div class="goodsname">
                                    C6金品醇酸磁漆长江漆 工业漆 金属漆 磁漆 防腐漆 油漆 涂料
                                </div>
                                <div class="pricebox">
                                    <b class="goods-price">￥359.00</b> <s class="market-price">￥388.00</s>
                                </div>
                            </div>
                        </li>
                        <li>
                            <div class="mc-goods-item-sm">
                                <a href="javascript:;" class="link"></a>
                                <div class="img-thumb">
                                    <img src="../static/images/cp2.jpg" alt="">
                                </div>
                                <div class="goodsname">
                                    C6金品醇酸磁漆长江漆 工业漆 金属漆 磁漆 防腐漆 油漆 涂料
                                </div>
                                <div class="pricebox">
                                    <b class="goods-price">￥359.00</b> <s class="market-price">￥388.00</s>
                                </div>
                            </div>
                        </li>
                        <li>
                            <div class="mc-goods-item-sm">
                                <a href="javascript:;" class="link"></a>
                                <div class="img-thumb">
                                    <img src="../static/images/cp014.jpg" alt="">
                                </div>
                                <div class="goodsname">
                                    C6金品醇酸磁漆长江漆 工业漆 金属漆 磁漆 防腐漆 油漆 涂料
                                </div>
                                <div class="pricebox">
                                    <b class="goods-price">￥359.00</b> <s class="market-price">￥388.00</s>
                                </div>
                            </div>
                        </li>
                        <li>
                            <div class="mc-goods-item-sm">
                                <a href="javascript:;" class="link"></a>
                                <div class="img-thumb">
                                    <img src="../static/images/cp015.jpg" alt="">
                                </div>
                                <div class="goodsname">
                                    C6金品醇酸磁漆长江漆 工业漆 金属漆 磁漆 防腐漆 油漆 涂料
                                </div>
                                <div class="pricebox">
                                    <b class="goods-price">￥359.00</b> <s class="market-price">￥388.00</s>
                                </div>
                            </div>
                        </li>
                        <li>
                            <div class="mc-goods-item-sm">
                                <a href="javascript:;" class="link"></a>
                                <div class="img-thumb">
                                    <img src="../static/images/cp016.jpg" alt="">
                                </div>
                                <div class="goodsname">
                                    C6金品醇酸磁漆长江漆 工业漆 金属漆 磁漆 防腐漆 油漆 涂料
                                </div>
                                <div class="pricebox">
                                    <b class="goods-price">￥359.00</b> <s class="market-price">￥388.00</s>
                                </div>
                            </div>
                        </li>
                        <li>
                            <div class="mc-goods-item-sm">
                                <a href="javascript:;" class="link"></a>
                                <div class="img-thumb">
                                    <img src="../static/images/cp017.jpg" alt="">
                                </div>
                                <div class="goodsname">
                                    C6金品醇酸磁漆长江漆 工业漆 金属漆 磁漆 防腐漆 油漆 涂料
                                </div>
                                <div class="pricebox">
                                    <b class="goods-price">￥359.00</b> <s class="market-price">￥388.00</s>
                                </div>
                            </div>
                        </li>
                    </ul>
                </div>
            </div>
            <script type="text/javascript">
                jQuery(".mc-picScroll-left").slide({titCell:".hd ul",mainCell:".bd ul",autoPage:true,effect:"left",autoPlay:false,vis:4,trigger:"click"});
            </script>
        </div>
    </div>
        <div class="item">
            <div class="shop-info-box">
                <div class="shop-logo">
                    <a href="javascript:;">
                        <img src="https://img30.360buyimg.com/popshop/jfs/t826/160/1351541112/7356/a70b9a6e/559f692aN188be41c.png" alt="">
                    </a>
                </div>
                <div class="shop-name">
                    <a href="javascript:;">锤子科技官方旗舰店</a>
                </div>
                <div class="shop-level">
                    <span class="tag">自营</span>
                    <span class="tag vip">VIP6</span>
                </div>
                <div class="follow-num">
                    关注量：12323
                </div>
                <div class="action">
                    <a href="javascript:;" class="link">进入店铺</a>
                    <a href="javascript:;" class="link">取消关注</a>
                </div>
            </div>
            <div class="goods-box">
                <div class="mc-picScroll-left">
                    <a class="next"><i class="iconfont icon-zuoyou1"></i></a>
                    <a class="prev"> <i class="iconfont icon-zuoyou"></i></a>
                    <div class="bd">
                        <ul class="picList">
                            <li>
                                <div class="mc-goods-item-sm">
                                    <a href="javascript:;" class="link"></a>
                                    <div class="img-thumb">
                                        <img src="../static/images/cp019.jpg" alt="">
                                    </div>
                                    <div class="goodsname">
                                        C6金品醇酸磁漆长江漆 工业漆 金属漆 磁漆 防腐漆 油漆 涂料
                                    </div>
                                    <div class="pricebox">
                                        <b class="goods-price">￥359.00</b> <s class="market-price">￥388.00</s>
                                    </div>
                                </div>
                            </li>
                            <li>
                                <div class="mc-goods-item-sm">
                                    <a href="javascript:;" class="link"></a>
                                    <div class="img-thumb">
                                        <img src="../static/images/cp2.jpg" alt="">
                                    </div>
                                    <div class="goodsname">
                                        C6金品醇酸磁漆长江漆 工业漆 金属漆 磁漆 防腐漆 油漆 涂料
                                    </div>
                                    <div class="pricebox">
                                        <b class="goods-price">￥359.00</b> <s class="market-price">￥388.00</s>
                                    </div>
                                </div>
                            </li>
                            <li>
                                <div class="mc-goods-item-sm">
                                    <a href="javascript:;" class="link"></a>
                                    <div class="img-thumb">
                                        <img src="../static/images/cp014.jpg" alt="">
                                    </div>
                                    <div class="goodsname">
                                        C6金品醇酸磁漆长江漆 工业漆 金属漆 磁漆 防腐漆 油漆 涂料
                                    </div>
                                    <div class="pricebox">
                                        <b class="goods-price">￥359.00</b> <s class="market-price">￥388.00</s>
                                    </div>
                                </div>
                            </li>
                            <li>
                                <div class="mc-goods-item-sm">
                                    <a href="javascript:;" class="link"></a>
                                    <div class="img-thumb">
                                        <img src="../static/images/cp015.jpg" alt="">
                                    </div>
                                    <div class="goodsname">
                                        C6金品醇酸磁漆长江漆 工业漆 金属漆 磁漆 防腐漆 油漆 涂料
                                    </div>
                                    <div class="pricebox">
                                        <b class="goods-price">￥359.00</b> <s class="market-price">￥388.00</s>
                                    </div>
                                </div>
                            </li>
                            <li>
                                <div class="mc-goods-item-sm">
                                    <a href="javascript:;" class="link"></a>
                                    <div class="img-thumb">
                                        <img src="../static/images/cp016.jpg" alt="">
                                    </div>
                                    <div class="goodsname">
                                        C6金品醇酸磁漆长江漆 工业漆 金属漆 磁漆 防腐漆 油漆 涂料
                                    </div>
                                    <div class="pricebox">
                                        <b class="goods-price">￥359.00</b> <s class="market-price">￥388.00</s>
                                    </div>
                                </div>
                            </li>
                            <li>
                                <div class="mc-goods-item-sm">
                                    <a href="javascript:;" class="link"></a>
                                    <div class="img-thumb">
                                        <img src="../static/images/cp017.jpg" alt="">
                                    </div>
                                    <div class="goodsname">
                                        C6金品醇酸磁漆长江漆 工业漆 金属漆 磁漆 防腐漆 油漆 涂料
                                    </div>
                                    <div class="pricebox">
                                        <b class="goods-price">￥359.00</b> <s class="market-price">￥388.00</s>
                                    </div>
                                </div>
                            </li>
                        </ul>
                    </div>
                </div>
                <script type="text/javascript">
                    jQuery(".mc-picScroll-left").slide({titCell:".hd ul",mainCell:".bd ul",autoPage:true,effect:"left",autoPlay:false,vis:4,trigger:"click"});
                </script>
            </div>
        </div>
    </div>
    <div class="block-title">
        账户信息
    </div>
    <ul class="mu-account">
        <li class="item item-tit">
            <table>
                <tr>
                    <td class="date">时间</td>
                    <td class="account">涉及金额</td>
                    <td class="accout-info">备注信息</td>
                </tr>
            </table>
        </li>
        <li class="item">
            <table>
                <tr>
                    <td class="date">2017-09-17 13:36:03</td>
                    <td class="account"><span class="minus">- 99.99</span></td>
                    <td class="accout-info">
                        购买消费，订单编号： <a href="javascript:;" class="link">21432134214321</a>,
                        商家：<a href="javascript:;" class="link">锤子手机官方旗舰店</a>
                    </td>
                </tr>
            </table>
        </li>
        <li class="item">
            <table>
                <tr>
                    <td class="date">2017-09-17 13:36:03</td>
                    <td class="account"><span class="plus">+ 99.99</span></td>
                    <td class="accout-info">
                        订单退款，订单编号： <a href="javascript:;" class="link">21432134214321</a>,
                        商家：<a href="javascript:;" class="link">锤子手机官方旗舰店</a>
                        商家已将款项退回支付账户，请注意查收。商家已经款项退回余额。商家已通过线下转账进行退款。
                        经双方协商，订单部分退款，退款已进行线下转账处理。
                    </td>
                </tr>
            </table>
        </li>
    </ul>
    <div class="block-title">
        发票列表
    </div>
    <ul class="mu-invoice">
        <li class="item item-tit">
            <table>
                <tr>
                    <td class="type">发票类型</td>
                    <td class="inv-info">开票信息</td>
                    <td class="address">邮寄信息</td>
                    <td class="inv-status">发票状态</td>
                </tr>
            </table>
        </li>
        <li class="item">
            <table>
                <tr>
                    <td class="type">
                        <span class="inv-type1">增值税普票</span>
                    </td>
                    <td class="inv-info">
                        发票抬头：山西嘎嘎家电子商务有限公司<br>
                        企业税号：21432142345M19MPDF<br>
                        对应订单：<a href="javascript:;" class="link">21432134214321</a>
                    </td>
                    <td class="address">
                        收票人：柴赟  联系电话：13096635151<br>
                        邮寄地址：山西省 晋中市 榆次区 顺城西街21321号测试地址长度测试地址长度测试地址长度
                    </td>
                    <td class="inv-status">
                        待确认/已开票/已邮寄
                        <br>发票编号：23142134
                        <br>圆通快递 快递单号：214321342
                    </td>
                </tr>
            </table>
        </li>
        <li class="item">
            <table>
                <tr>
                    <td class="type">
                        <span class="inv-type2">增值税专票</span>
                    </td>
                    <td class="inv-info">
                        发票抬头：山西嘎嘎家电子商务有限公司<br>
                        企业税号：21432142345M19MPDF<br>
                        对应订单：<a href="javascript:;" class="link">21432134214321</a>
                    </td>
                    <td class="address">
                        收票人：柴赟  联系电话：13096635151<br>
                        邮寄地址：山西省 晋中市 榆次区 顺城西街21321号测试地址长度测试地址长度测试地址长度
                    </td>
                    <td class="inv-status">
                        待确认/已开票/已邮寄
                        <br>发票编号：23142134
                        <br>圆通快递 快递单号：214321342
                    </td>
                </tr>
            </table>
        </li>
    </ul>
    <div class="block-title">
        订单列表
    </div>
    <div class="mu-order-list">
        <div class="item">
            <div class="item-tit">
                <div class="shopinfo">
                    <a href="javascript:;" class="link">国联全网官方旗舰店</a>
                    <span class="tag">自营</span>
                    <span class="tag vip">VIP</span>
                </div>
                <div class="order-sn">
                    订单号：<a href="javascript:;" class="sn">234214123421421</a>
                    订单时间：2017-09-21 12:00:30
                </div>
            </div>
            <div class="item-con">
                <table class="order-table">
                    <tr class="tit">
                        <td class="goodsinfo">商品信息</td>
                        <td class="price">单价</td>
                        <td class="number">数量</td>
                        <td class="pay">实付款</td>
                        <td class="status">交易状态</td>
                        <td class="action">交易操作</td>
                    </tr>
                    <tr>
                        <td colspan="3" class="order-goods-box">
                            <ul class="goods-price-list">
                                <li class="list-item">
                                    <div class="goodsbox">
                                        <div class="thumb">
                                            <a href="javascript:;">
                                                <img src="/tpl/default@0/static/images/cp014.jpg" alt="">
                                            </a>
                                        </div>
                                        <div class="text-info">
                                            <a href="javascript:;" class="goods-name">
                                                织梦新闻资讯网站源码整站带数据dede新闻门户网站模板带手机版据dede新闻门户网站模板带手机版de新闻门户网站模板带手机版
                                            </a>
                                            <div class="sku-name">
                                                颜色分类：白色[325]尺码：37
                                            </div>
                                        </div>
                                    </div>
                                    <div class="pricebox">
                                        <span class="con">￥13.00</span>
                                    </div>
                                    <div class="numbox">
                                        <span class="con">100</span>
                                    </div>
                                </li>
                                <li class="list-item">
                                    <div class="goodsbox">
                                        <div class="thumb">
                                            <a href="javascript:;">
                                                <img src="/tpl/default@0/static/images/cp014.jpg" alt="">
                                            </a>
                                        </div>
                                        <div class="text-info">
                                            <a href="javascript:;" class="goods-name">
                                                织梦新闻资讯网站源码整站带数据dede新闻门户网站模板带手机版据dede新闻门户网站模板带手机版de新闻门户网站模板带手机版
                                            </a>
                                            <div class="sku-name">
                                                颜色分类：白色[325]尺码：37
                                            </div>
                                        </div>
                                    </div>
                                    <div class="pricebox">
                                        <span class="con">￥13.00</span>
                                    </div>
                                    <div class="numbox">
                                        <span class="con">100</span>
                                    </div>
                                </li>
                            </ul>
                        </td>
                        <td class="pay">￥1300.00</td>
                        <td class="status">订单已提交，等待确认<br>线下支付请上传支付凭证</td>
                        <td class="action">
                            <a href="javascript" class="action-link">银行转账信息</a>
                            <a href="javascript" class="action-link">更换支付方式</a>
                            <a href="javascript" class="action-link">取消订单</a>
                        </td>
                    </tr>
                </table>
            </div>
        </div>
        <div class="item">
            <div class="item-tit">
                <div class="shopinfo">
                    <a href="javascript:;" class="link">国联全网官方旗舰店</a>
                    <span class="tag">自营</span>
                    <span class="tag vip">VIP</span>
                </div>
                <div class="order-sn">
                    订单号：<a href="javascript:;" class="sn">234214123421421</a>
                    订单时间：2017-09-21 12:00:30
                </div>
            </div>
            <div class="item-con">
                <table class="order-table">
                    <tr class="tit">
                        <td class="goodsinfo">商品信息</td>
                        <td class="price">单价</td>
                        <td class="number">数量</td>
                        <td class="pay">实付款</td>
                        <td class="status">交易状态</td>
                        <td class="action">交易操作</td>
                    </tr>
                    <tr>
                        <td colspan="3" class="order-goods-box">
                            <ul class="goods-price-list">
                                <li class="list-item">
                                    <div class="goodsbox">
                                        <div class="thumb">
                                            <a href="javascript:;">
                                                <img src="/tpl/default@0/static/images/cp014.jpg" alt="">
                                            </a>
                                        </div>
                                        <div class="text-info">
                                            <a href="javascript:;" class="goods-name">
                                                织梦新闻资讯网站源码整站带数据dede新闻门户网站模板带手机版据dede新闻门户网站模板带手机版de新闻门户网站模板带手机版
                                            </a>
                                            <div class="sku-name">
                                                颜色分类：白色[325]尺码：37
                                            </div>
                                        </div>
                                    </div>
                                    <div class="pricebox">
                                        <span class="con">￥13.00</span>
                                    </div>
                                    <div class="numbox">
                                        <span class="con">100</span>
                                    </div>
                                </li>
                                <li class="list-item">
                                    <div class="goodsbox">
                                        <div class="thumb">
                                            <a href="javascript:;">
                                                <img src="/tpl/default@0/static/images/cp014.jpg" alt="">
                                            </a>
                                        </div>
                                        <div class="text-info">
                                            <a href="javascript:;" class="goods-name">
                                                织梦新闻资讯网站源码整站带数据dede新闻门户网站模板带手机版据dede新闻门户网站模板带手机版de新闻门户网站模板带手机版
                                            </a>
                                            <div class="sku-name">
                                                颜色分类：白色[325]尺码：37
                                            </div>
                                        </div>
                                    </div>
                                    <div class="pricebox">
                                        <span class="con">￥13.00</span>
                                    </div>
                                    <div class="numbox">
                                        <span class="con">100</span>
                                    </div>
                                </li>
                            </ul>
                        </td>
                        <td class="pay">￥1300.00</td>
                        <td class="status">订单已提交，等待确认<br>线下支付请上传支付凭证</td>
                        <td class="action">
                            <a href="javascript" class="action-link">银行转账信息</a>
                            <a href="javascript" class="action-link">更换支付方式</a>
                            <a href="javascript" class="action-link">取消订单</a>
                        </td>
                    </tr>
                </table>
            </div>
        </div>
    </div>
    <div class="block-title">
        订单详情
    </div>
    <div class="mu-order-info">
        <ul class="mu-order-status">
            <li class="statusbox over">
                <span class="iconfont icon-tijiaodingdan status-icon"></span>
                <div class="status-text">
                    <div class="text">提交订单</div>
                    <div class="date">2017-09-23 <span class="time">16:21:30</span></div>
                </div>
            </li>
            <li class="proce over-half-wait">
                <span class="info">等待付款</span>
            </li>
            <li class="statusbox over">
                <span class="iconfont icon-fukuan status-icon"></span>
                <div class="status-text">
                    <div class="text">付款成功</div>
                    <div class="date">2017-09-23 <span class="time">16:21:30</span></div>
                </div>
            </li>
            <li class="proce over-half"></li>
            <li class="statusbox">
                <span class="iconfont icon-chukudan1 status-icon"></span>
                <div class="status-text">
                    <div class="text">订单发货</div>
                    <div class="date">2017-09-23 <span class="time">16:21:30</span></div>
                </div>
            </li>
            <li class="proce over-half-wait">
                <span class="info">等待收货</span>
            </li>
            <li class="statusbox">
                <span class="iconfont icon-tubiao status-icon"></span>
                <div class="status-text">
                    <div class="text">等待收货</div>
                    <div class="date">2017-09-23 <span class="time">16:21:30</span></div>
                </div>
            </li>
            <li class="proce over"></li>
            <li class="statusbox">
                <span class="iconfont icon-dingdanwancheng status-icon"></span>
                <div class="status-text">
                    <div class="text">订单完成</div>
                    <div class="date">2017-09-23 <span class="time">16:21:30</span></div>
                </div>
            </li>

        </ul>
    </div>
    <div class="block-title">
        订单评价
    </div>
    <div class="mu-order-evaluate">
        <form class="pure-form pure-form-aligned mu-form mu-form-aligned">
        <div class="star-row">
            <div class="mu-star-score">
                <div class="tit">服务评分</div>
                <div class="mu-star">
                    <label for="service1" class="starbox">
                        <input type="radio" id="service1" class="score" value="1" name="seavice">
                    </label>
                    <label for="service2" class="starbox">
                        <input type="radio" id="service2" class="score" value="2" name="seavice">
                    </label>
                    <label for="service3" class="starbox">
                        <input type="radio" id="service3" class="score" value="3" name="seavice">
                    </label>
                    <label for="service4" class="starbox">
                        <input type="radio" id="service4" class="score" value="4" name="seavice">
                    </label>
                    <label for="service5" class="starbox">
                        <input type="radio" id="service5" class="score" value="5" name="seavice">
                    </label>
                </div>
                <div class="score-number"></div>
            </div>
            <div class="mu-star-score">
                <div class="tit">物流评分</div>
                <div class="mu-star">
                    <label for="logistics1" class="starbox">
                        <input type="radio" id="logistics1" class="score" value="1" name="logistics">
                    </label>
                    <label for="logistics2" class="starbox">
                        <input type="radio" id="logistics2" class="score" value="2" name="logistics">
                    </label>
                    <label for="logistics3" class="starbox">
                        <input type="radio" id="logistics3" class="score" value="3" name="logistics">
                    </label>
                    <label for="logistics4" class="starbox">
                        <input type="radio" id="logistics4" class="score" value="4" name="logistics">
                    </label>
                    <label for="logistics5" class="starbox">
                        <input type="radio" id="logistics5" class="score" value="5" name="logistics">
                    </label>
                </div>
                <div class="score-number"></div>
            </div>
            <div class="mu-star-score">
                <div class="tit">商品评分</div>
                <div class="mu-star">
                    <label for="goods1" class="starbox">
                        <input type="radio" id="goods1" class="score" value="1" name="goods">
                    </label>
                    <label for="goods2" class="starbox">
                        <input type="radio" id="goods2" class="score" value="2" name="goods">
                    </label>
                    <label for="goods3" class="starbox">
                        <input type="radio" id="goods3" class="score" value="3" name="goods">
                    </label>
                    <label for="goods4" class="starbox">
                        <input type="radio" id="goods4" class="score" value="4" name="goods">
                    </label>
                    <label for="goods5" class="starbox">
                        <input type="radio" id="goods5" class="score" value="5" name="goods">
                    </label>
                </div>
                <div class="score-number"></div>
            </div>
        </div>
            <fieldset>
                <div class="pure-control-group">
                    <label class="group-tit" for="content">评论内容</label>
                    <textarea id="content" placeholder="请输入评论内容"></textarea>
                </div>
                <div class="pure-controls">
                    <label class="group-tit" for="cb" class="pure-checkbox">
                        <input id="cb" type="checkbox"> 匿名评价
                    </label>
                </div>
                <div class="um-action-box">
                    <button type="submit" class="pure-button pure-button-primary">提交评价</button>
                </div>
            </fieldset>
        </form>
    </div>
    <script>
        $('.starbox').click(function () {
            $(this).siblings().removeClass('star-active');
            $(this).addClass('star-active').prevAll().addClass('star-active');
            $(this).parents('.mu-star').next().text($(this).find('.score').val()+'.0分');
        })
        $('.starbox').hover(function () {
            $(this).addClass('star-active').prevAll().addClass('star-active');
        },function () {
            $(this).removeClass('star-active').siblings().removeClass('star-active');
            $('.score:checked').parents('.starbox').addClass('star-active').prevAll().addClass('star-active');
        })
    </script>
    <div class="block-title">
        账户安全
    </div>
    <div class="mu-account-security">
        <div class="account-info">
            当前登录账户：chaiyun2617@163.com <a href="" class="action-link">更换账户</a>
        </div>
        <div class="security-level">
            <div class="tit">账户安全级别</div>
            <div class="speed">
                <div class="bar bar1"></div>
            </div>
            <div class="text-info">
                <span class="level-1"></span> 建议您启动全部安全设置，以保障账户及资金安全。
            </div>
        </div>
        <ul class="security-list">
            <li class="item">
                <div class="security-info">
                    <span class="icon icon2"></span>
                    <span>登录密码</span>
                </div>
                <div class="text-info">
                    互联网账号存在被盗风险，建议您定期更改密码以保护账户安全。
                </div>
                <a href="javascript:;" class="action">修改密码</a>
            </li>
            <li class="item">
                <div class="security-info">
                    <span class="icon icon2"></span>
                    <span>手机验证</span>
                </div>
                <div class="text-info">
                    您验证的手机：130****5151解除绑定
                </div>
                <a href="javascript:;" class="action">更改绑定</a>
            </li>
            <li class="item">
                <div class="security-info">
                    <span class="icon icon1"></span>
                    <span>邮箱验证</span>
                </div>
                <div class="text-info">
                    互联网账号存在被盗风险，建议您定期更改密码以保护账户安全。
                </div>
                <a href="javascript:;" class="action">更改绑定</a>
            </li>
        </ul>

    </div>

    <div class="block-title">
        无信息提示
    </div>
    <div class="mu-no-msg">
        <span class="iconfont icon-daipingjia"></span>
        <div class="text">还没有订单呢</div>
        <a href="javascript:;" class="action-link">去挑选心仪的商品吧&gt;</a>
    </div>


</div>
<div class="user-main-title">
    <h2 class="title">
        栏目标题 <span class="sub">这里放栏目描述</span>
    </h2>
    <a class="more" href="javascript:;">操作链接 &gt;</a>
</div>
